import React, {useEffect, useState} from "react";
import "./NavBreadcrumb.css"
import {Breadcrumb} from 'antd';
import {useLocation} from 'react-router-dom'
import {routerItem} from "@/router/router";


/**
 * 面包屑组件
 * @constructor
 */

const NavBreadcrumb = () => {
    const location = useLocation()
    const [router]: any = useState(routerItem)
    const [breadcrumb, setBreadcrumb] = useState({
        fatherName: '',
        fatherPath: '',
        name: null,
        path: null
    })

    useEffect(() => {

        router[2].children.forEach((item: { children?: Array<object>, element: object, name: string, path: string }) => {
                //判断是否有子菜单
                if (item.children && item.children.length > 0) {
                    item.children.forEach((item1: any) => {
                        if (item1.path === location.pathname) {
                            setBreadcrumb({
                                fatherName: item.name,
                                fatherPath: item.path,
                                name: item1.name,
                                path: item1.path
                            })
                        }
                    })
                } else {
                    //没有子菜单，找到了，说明只有一层，直接返回
                    if (item.path === location.pathname) {
                        //如果刚好等于主页地址，不在进行显示
                        if (location.pathname !== '/main/home') {
                            setBreadcrumb({
                                fatherName: item.name,
                                fatherPath: item.path,
                                name: null,
                                path: null
                            })
                        } else {
                            setBreadcrumb({
                                fatherName: '',
                                fatherPath: '',
                                name: null,
                                path: null
                            })
                        }

                    }
                }


            }
        )

    }, [location])
    return (
        <Breadcrumb className={"breadcrumb_box"} >
            <Breadcrumb.Item><a href="/main/home">主页</a></Breadcrumb.Item>
            <Breadcrumb.Item>
                {breadcrumb.fatherName}
            </Breadcrumb.Item>
            <Breadcrumb.Item>
                {breadcrumb.name}
            </Breadcrumb.Item>
        </Breadcrumb>
    )
}
export default NavBreadcrumb;
